<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">

<script type="text/javascript">
function initLogs()
{
	jgrouse.log.addHandler(new jgrouse.logHandlers.ConsoleLog());
}

jgrouse_config = 
{
	initLogs : initLogs,
	logLevel : 'INFO',
	nologs : false,
	debug : true
}
</script>

<script type="text/javascript" src='../src/jgrouse.js'></script>
<script type="text/javascript" src='../src/log.js'></script>
<script type="text/javascript" src='../src/classloader.js'></script>

<style type="text/css">
.over
{
	font-size: 2em;
}
.spicy
{
	color: red;
}

.highlight
{
	background-color: green;
	color: white;
}

.bolder 
{
	font-weight: bold;
}
</style>

<script type="text/javascript">


jgrouse.module(
{
	name:'testContainer', 
	requires:['jgrouse.widgets.StaticText', 'jgrouse.widgets.TemplateParser', 
			   'jgrouse.widgets.Container', 'jgrouse.widgets.Button'], 
	imports : ['jgrouse.widgets.TemplateParser', 'jgrouse.dom.Event', 'jgrouse.dom.Element', 'jgrouse.string.*'],  
	body:function(salt)
	{
		eval(salt);


		jgrouse.define('testContainer', 'jgrouse.widgets.Container', function(embed)
		{
			eval(embed);
			
			jgrouse.widgets.registerWidget('testContainer', 'testContainer');
			
			return {
				initialize : function(options, styles)
				{
					_sup(this, arguments);
					this._content = null;
					this._origDom = null;
				},
				
				setContent : function(content)
				{
					this._content = content;
				},
				
				setOwnMvcDriver : function(own)
				{
					_sup(this, arguments);
					own.bind(this, 'triggerSwitch', 'triggerSwitch');
				},
				
				onTriggerSwitch : function()
				{
					if (this._origDom)
					{
						this.addWidget(this._content, this._origDom);
						this._origDom = null;
					}
					else
					{
						this._origDom = this.removeWidget(this._content);
					}
					
				}
			
			}
		});

	}
});


function initApp()
{
	var item = document.getElementById('appContainer');
	app = new jgrouse.widgets.Container();
	app.setControllerClass('jgrouse.util.BaseController');
	app.setTemplate(item.innerHTML);
	item.innerHTML = '';
	app.add(item);
}

function doRun()
{
	var s = document.getElementById('area').value;
	var r = eval(s);
	alert(r);
}

function doHide()
{
	container.remove(true);
}

</script>

</head>
<body>
	<div id='zhopa' style='border: thin solid black;'> bla!</div>
	<div id='appContainer' >
		<div _jgtype="testContainer">
			<div>Header</div>
			<div _jgtype="container" _jgmember="content" >
				<a href="#zhopa" _jgtype="link" _bindings="triggerClick:triggerLink; value:linkValue" _suppress-default="click">Clicker!</a>
			</div>
			<input _jgtype="button" _bindings="triggerClick:triggerSwitch" name="Click me" value="clicker"/>
		</div>
	</div>
	<a href="dummyLink" id='simple'>This is a simple link for testing</a>
	<form >
		<textarea rows="10" cols="80" name="area" id='area'></textarea>
		<input type="button" name="run" value="Run" onclick="doRun()">
		<br>
		<input type='button' name='show' value='show' onclick='initApp()'>
		<input type='button' name='hide' value='hide' onclick='doHide()'>
	</form>
</body>
<script type="text/javascript">

	jgrouse.require('testContainer', function()
	{
		initApp();
	});
</script>
</html>